<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<input type="checkbox" id="all">全选<br>
		<hr>
		<input type="checkbox" class="box">电脑<br>
		<input type="checkbox" class="box">手机<br>
		<input type="checkbox" class="box">电视<br>
		<script>
			var all = document.getElementById('all');
			var box = document.getElementsByClassName('box');
			//全选框添加点击事件
			//			all.onclick=function(){
			//				for(var i=0;i<box.length;i++){
			//全选与反选：all如果是选中所有box都选中，all如果没选中，所有box都不选中
			//方式1
			//box[i].checked=all.checked;
			//方式2：事情默认都会有一个事情对象event event.target表示触发事情的对象本事
			//box[i].checked=event.target.checked;
			//}
			//};
			//事件监听式 :点击all，执行myfun这个函数
			all.addEventListener('click',myfun,false);

			function myfun() {
				for(var i = 0; i < box.length; i++) {
					box[i].checked = event.target.checked;
				}
			}
		</script>
	</body>

</html>